<#include "/common/head.ftl">

<#macro formatOn status>
	<#if status == 22>
		;background-color:yellow
	<#elseif status == 1>
		;background-color:green
	<#elseif status == 2>
		;background-color:lightgray
	</#if>
</#macro>

<html>

<head>

<title>Schedules</title>

<style>

* {
	font-size:0.35cm;
}

a { 
	text-decoration:none;
	color:000; 
}
	
table.nameTable {
	empty-cells:show;
	border-top: 1px solid black;
	border-right: 1px solid black;
}

table.nameTable tr {
	
}

table.nameTable tr td {
	border-left: 1px solid black;
	border-bottom: 1px solid black;
}

#simpleTooltip { padding: 5px; border: 1px solid #A6A7AB; background: #F2F3F5; }
</style>

<script language="javascript" type="text/javascript" src="../scripts/jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="../scripts/jquery.tooltip.v.1.1.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function() {	
	$(".nameTable tr td").simpletooltip();
});
</script>

</head>

<body style="padding:0cm">

<div style="width:27cm;text-align:left;margin:0cm;padding:0px">

<p style="font-size:0.7cm;font-weight:bolder;text-align:center">SCHEDULES (${(fromDate)!} - ${(toDate)!})</p>

<table class="nameTable" border="0" style="width:100%" cellspadding="0" cellspacing="0">
	<tr style="text-align:center; font-weight:bold;background-color:#D6FAEB;font-size:11px;padding:2px">
		<td rowspan="2" style="text-align:center; width:20px">${i18n.getMessage('ordinalNumber')}</td>
		<td rowspan="2" style="text-align:center">${i18n.getMessage('class')}</td>
		<td rowspan="2">${i18n.getMessage('time')}</td>
		<td rowspan="2">${i18n.getMessage('startDate')}</td>
		<td rowspan="2">${i18n.getMessage('endDate')}</td>
		<td rowspan="2">Midterm <br/> Written</td>
		<td rowspan="2">Final <br/> Spoken</td>
		<td rowspan="2">Final <br/> Written</td>
		<td rowspan="2">Sample <br/> Test</td>
		<td rowspan="2">Cambridge <br/> Test</td>
		<td rowspan="2">Room <br/> (Anna)</td>
		<td rowspan="2">Number of <br/> Students</td>
		<#list days as day>
			<td style="width:50px;height:20px">${day?string('EEE')}</td>
		</#list>
	</tr>
	<tr style="text-align:center;font-weight:bold;background-color:#D6FAEB;font-size:11px">
		<#list days as day>
			<td>${(day?string('dd-MMM'))!'&nbsp'}</td>
		</#list>
	</tr>
	<#assign scheduleMap = CollectionUtil.createScheduleMap(days)>
	${request.setAttribute("scheduleMap", scheduleMap)}	
	<#list offerings as offering>
		<tr>
			<td style="text-align:center;padding-left:3px">${(offering_index + 1)!}</td>
			<td style="font-weight:bold;text-align:center;" nowrap="nowrap">${(offering.name)!'&nbsp'}</td>
			<td style="text-align:center;width:80px;" nowrap="nowrap">${(offering.shift.startTime)!'&nbsp'} - ${(offering.shift.endTime)!'&nbsp'}</td>
			<td style="text-align:center;width:90px">${(offering.startDate?date)!'&nbsp'}</td>
			<td style="text-align:center;width:100px">${(offering.endDate?date)!'&nbsp'}</td>
			
			<td style="text-align:center;width:55px; <#if action.isBetween(offering.midtermWrittenDate)>background-color:#00BFFF</#if>">${(offering.midtermWrittenDate?string('dd-MMM'))!'&nbsp'}</td>
			<td style="text-align:center;width:55px; <#if action.isBetween(offering.finalSpokenDate)>background-color:#00BFFF</#if>">${(offering.finalSpokenDate?string('dd-MMM'))!'&nbsp'}</td>
			<td style="text-align:center;width:55px; <#if action.isBetween(offering.finalWrittenDate)>background-color:#00BFFF</#if>">${(offering.finalWrittenDate?string('dd-MMM'))!'&nbsp'}</td>
			<td style="text-align:center;width:55px; <#if action.isBetween(offering.cambridgeSpokenDate)>background-color:#00BFFF</#if>">${(offering.cambridgeSpokenDate?string('dd-MMM'))!'&nbsp'}</td>
			<td style="text-align:center;width:55px; <#if action.isBetween(offering.cambridgeWrittenDate)>background-color:#00BFFF</#if>">${(offering.cambridgeWrittenDate?string('dd-MMM'))!'&nbsp'}</td>
			
			<td style="text-align:center;width:50px">${(offering.room.name)!'&nbsp'}</td>
			<td style="text-align:center;width:50px">${(offering.getNumberOfActiveStudents(toDateDate))!}</td>
			<#list days as day>
				<#assign teacher = (offering.getTeacher(day))! >
				<#assign makeUp = (offering.getInstructorMakeUp(day))!>
				<#assign interruption = (offering.getInstructorInterruption(day))!>
					<#if makeUp?has_content>
						<#assign status = 22>
					<#elseif interruption?has_content>
						<#assign status = (interruption.getStatus(day))!(-1)>
					<#else>					
						<#assign status = 0>
					</#if>
				<#assign abs = offering.getNumberOfAbsentMembers(day)>
				<td style="text-align:center;width:100px;padding-left:3px<@formatOn status/>" title="${(teacher.fullName)!}">
					<#if !action.isValid(day, offering.startDate, offering.endDate)>
						&nbsp;
					<#elseif teacher?has_content && DayOffService.exists(day)>
						Holiday
					<#elseif status == 0>
						${(teacher.midName)!} ${(teacher.firstName)!}
					<#elseif status == 1>
						<p style="font-weight:bold">${(teacher.midName)!} ${(teacher.firstName)!}
					<#elseif status == 11>
						${(teacher.midName)!} ${(teacher.firstName)!}
					<#elseif status == 2>
						<p style="font-weight:bold"><span style="text-decoration: line-through">${(teacher.midName)!}${(teacher.firstName)!}</span>
					<#elseif status == 22>
						<p style="font-weight:bold">${(teacher.midName)!} ${(teacher.firstName)!}
					<#else>
						&nbsp;
					</#if>
					<#if (abs != 0)>
						[${abs}]
					</#if>
					<#if offering.checkExistStudy(day)>
						<#assign session = offering.shift.name>
						<#assign count = scheduleMap.get(day).get(session) + 1>
						${scheduleMap.get(day).put(session, count)}
					</#if>
					</p>
				</td>
			</#list>
		</tr>
	</#list>
	<tr >
		<td rowspan="2" colspan="10" style="font-weight: bold" align="center"> TỔNG KẾT</>
		<td colspan="2" style="font-weight: bold" align="center"> Ca 1:</td>
		<#list days as day>
			<td align="center">
				${scheduleMap.get(day).get("Session 1")}
			</td>
		</#list>			
	</tr>
	<tr>
		<td colspan="2" style="font-weight: bold" align="center"> Ca 2:</td>
		<#list days as day>
			<td align="center">
				${scheduleMap.get(day).get("Session 2")}
			</td>
		</#list>			
	</tr>
</table>

<p></p>

<table>
	<tr>
		<td style="text-align:center;width:2cm;background-color:#00BFFF;font-weight:bold">BLUE</td>
		<td>Spoken Date</td>
	</tr>
	<tr>
		<td style="text-align:center;width:2cm;background-color:green;font-weight:bold">GREEN</td>
		<td>Substitution</td>
	</tr>
	<tr>
		<td style="text-align:center;background-color:lightgray;font-weight:bold;text-decoration:line-through">GRAY</td>
		<td>Cancel</td>
	</tr>
	<tr>
		<td style="text-align:center;width:2cm;background-color:yellow;font-weight:bold">YELLOW</td>
		<td>Make-up</td>
	</tr>
</table>
</div>

</body>
</html>